<template>
	<view class="page" :style="!isLogin?'background-color:#F6F6F6':''">
		<view class="my-top bg-topic-theme">
			<!-- head -->

			<view class="user-info" @click="onUserInfo">
				<view class="portrait">
					<image :src="!isLogin?'../../static/img/tracker.jpg':user.avatar"></image>
					<view v-if="isLogin" class="userLevel round shadow">
						<text class="text-yellow text-Abc text-sm"></text>
					</view>
				</view>
				<view v-if="!isLogin" class="info" @tap="hrefLogin">
					<text class="text-black text-bold text-lg">未登录，点击登录~</text>
				</view>
				<view v-if="isLogin" class="info">
					<view class="tname_show">
            <!-- 货主姓名和下划线 -->
						<text class="" style="font-size: 50rpx;">{{Tname}}</text>
            <hr style="height: 3rpx; background-color: #fff; width: 200rpx;">
					</view>
				</view>
			</view>

			<!-- <view v-if="isLogin" class="my-card" @click="showCard" :style="isShowCard?'bottom:0rpx':'-70rpx'">
				<image class="bg-card" src="../../static/img/card_son.jpg"></image>
				<view class="label-name">
					<text class="text-white">我的名片</text>
					<text class="text-white" style="margin-left: auto;">查看</text>
				</view>

			</view> -->
		</view>

		<view v-if="!isLogin" class="noLogin-img">
			<image src="../../static/empty/empty_groupon.png"></image>
		</view>
		<view v-if="!isLogin" class="noLogin-text" @tap="hrefLogin">
			<text class="text-gray text-lg">请先登陆~</text>
		</view>
		
		<!-- 钱包 -->
		<view v-if="isLogin" class="wallet-info">
			<view class="list">
				<view class="icon">
					<text class="number">{{user.integral}}</text>
				</view>
				<view class="title">
					<text>货单历史</text>
				</view>
			</view>
			<view class="list" @click="collection">
				<view class="icon">
					<text class=" number">{{user.collection}}</text>
				</view>
				<view class="title">
					<text>我的评价</text>
				</view>
			</view>
			<view class="list" @click="Unused">
				<view class="icon">
					<text class="number">{{user.unused}}</text>
				</view>
				<view class="title">
					<text>预约货单</text>
				</view>
			</view>
			<view class="list" @click="Task">
				<view class="icon">
					<text class="number">{{user.task}}</text>
				</view>
				<view class="title">
					<text>待定</text>
				</view>
			</view>

		</view>

	
		<!-- 我的服务 -->
		<view v-if="isLogin" class="my-service">
			<view class="title">
				<text>我的服务</text>
			</view>
			<view class="service-list">
				<view class="list">
					<view class="thumb">
						<text class="cuIcon-writefill"></text>
					</view>
					<view class="name">
						<text>意见反馈</text>
					</view>
				</view>
				<view class="list" @click="onServer('serve')">
					<view class="thumb">
						<text class="cuIcon-commandfill"></text>
					</view>
					<view class="name">
						<text>客服交流</text>
					</view>
				</view>

			</view>
		</view>

		<!-- 客服热线 -->
		<view class="serve-hotline" @click="isHotline = false">
			<view class="cu-modal bottom-modal" :class="{'show':isHotline}">
				<view class="cu-dialog">
					<view class="contact-list">
						<view class="list">
							<text>群号</text>
						</view>
						<view class="list">
							<text style="color: #959595;">40574850</text>
						</view>
						<view class="list">
							<text>取消</text>
						</view>
					</view>
				</view>
			</view>
		</view>


	</view>
</template>

<script>
	import Gridme from "@/components/gridme.vue"
	import {
		mapMutations
	} from "vuex"
	export default {
		components: {
			Gridme
		},
		data() {
			return {
				scrollTop: 0,
				isHotline: false,
				progressWidth: "0%",
				isShowCard: false,
				isLogin: false,
				user: {},
				gridCol: 4,
        Tname:"老司机"
				
			}
	},
	onShow: function() {
			//每次显示本界面时都会更新最新数据（不访问数据库）
			try {
				const Auth = uni.getStorageSync('Auth');
				if (Auth.isLogin) {
					this.isLogin = true
					this.user = this.$store.state.user.user
					this.isShowCard = true
				} else {
					this.isLogin = false
				}
			} catch (e) {
				uni.showToast({
					title: "数据异常，请重试~",
					duration: 1500
				})
			}


		},
		onHide: function() {
			this.isShowCard = false
		},
		mounted() {
			// //第一次进入本界面时都会更新最新数据（访问数据库）
			// try {
			//     const Auth = uni.getStorageSync('Auth');
			//     if (Auth.isLogin) {
			// 		uni.showLoading({})
			// 		uniCloud.callFunction({
			// 			name: 'selectUser',
			// 			data: {
			// 				phone: Auth.phone
			// 			}
			// 		}).then((res) => {
			// 			this.user = res.result.data[0]
			// 			this.isLogin=true
			// 			this.progressWidth = this.user.grow+"%"
			// 			this.isShowCard=true
			// 			this.$store.commit("user/setUser", this.user)
			// 			uni.hideLoading()
			// 		}).catch((err) => {
			// 			uni.hideLoading()
			// 			uni.showModal({
			// 				content: `操作失败：${err.message}`,
			// 				showCancel: false
			// 			})
			// 		})
			//     }
			// 	else{
			// 		this.isLogin=false
			// 	}
			// } catch (e) {
			// 	uni.showToast({
			// 		title:"数据异常，请重试~",
			// 		duration:1500
			// 	})
			// }
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},

		methods: {
			...mapMutations("user", ["setUser"]),
			showCard() {
				uni.navigateTo({
					url: "../../view/myCard?phone=" + this.$store.state.user.user.phone
				})
			},
			hrefSort(item) {
				if(item.name==="我的店铺")
				{
					uni.navigateTo({
						url: "../store/store"
					})
				}else
				{
					// uni.navigateTo({
					// 	url: "../../view/sort?item=" + encodeURIComponent(JSON.stringify(item))
					// })
				}
				
			},
			login() {
				uni.navigateTo({
					url: "../index/login"
				})
			},

			follow() {
				uni.navigateTo({
					url: "../../view/follow"
				})
			},
			Task() {
				uni.navigateTo({
					url: "../../view/myTask"
				})
			},
			collection() {
				uni.navigateTo({
					url: "../../view/collection"
				})
			},
			Unused() {
				uni.navigateTo({
					url: "../../view/myUnused"
				})
			},
			fans() {
				uni.navigateTo({
					url: "../../view/fans"
				})
			},
			issue() {
				uni.navigateTo({
					url: "../../view/issue"
				})
			},
			ToCode() {
				uni.navigateTo({
					// url: "../../view/code"
					url:"../../view/adress"
				})
			},
			SignIn() {
				uni.navigateTo({
					url: "../../view/sign"
				})
			},
			/**
			 * 关注跳转
			 */
			onCollect(type) {
				switch (type) {
					case 'goods':
						uni.navigateTo({
							url: '/pages/GoodsOn/GoodsOn'
						})
						break;
					case 'content':
						uni.navigateTo({
							url: '/pages/ContentCollection/ContentCollection'
						})
						break;
					case 'record':
						uni.navigateTo({
							url: '/pages/BrowsingHistory/BrowsingHistory'
						})
						break;
				}
			},
			/**
			 * 订单
			 */
			onSkipOrder(type) {
				if (type === 5) {
					uni.navigateTo({
						url: '/pages/AfterSalesOrder/AfterSalesOrder',
					})
					return;
				}
				uni.navigateTo({
					url: '/pages/MyOrderList/MyOrderList?type=' + type,
				})
			},
			/**
			 * 钱包跳转点击
			 */
			onWallet(type) {
				switch (type) {
					case 'integral':
						uni.navigateTo({
							url: '/pages/IntegralDetails/IntegralDetails',
						})
						break;
					case 'coupon':
						uni.navigateTo({
							url: '/pages/MyCoupon/MyCoupon',
						})
						break;
					case 'wallet':
						uni.navigateTo({
							url: '/pages/MyWallet/MyWallet',
						})
						break;
					case 'SignIn':
						uni.navigateTo({
							url: '/pages/SignIn/SignIn',
						})
						break;
					case 'payment':
						uni.navigateTo({
							url: '/pages/PaymentCode/PaymentCode',
						})
						break;
					case 'we':
						uni.reLaunch({
							url: '/pages/index/index?isBack=true',
						})
						break;
				}
			},
			/**
			 * 我的服务点击
			 */
			onServer(type) {
				switch (type) {
					case 'feedback':
						uni.navigateTo({
							url: '/pages/Feedback/Feedback'
						})
						break;
					case 'serve':
						this.isHotline = true;
						break;
				}
			},
			/**
			 * 设置点击
			 */
			onSetting() {
				uni.navigateTo({
					url: '/pages/Setting/Setting'
				})
			},
			/**
			 * 消息点击
			 */
			onMessage() {
				uni.navigateTo({
					url: '/pages/Message/Message'
				})
			},
			/**
			 * 会员点击
			 */
			onMmeberVip() {
				uni.navigateTo({
					url: '/pages/MembersOpened/MembersOpened',
				})
			},
			/**
			 * 跳转点击
			 * @param {String} type 跳转类型
			 */
			onSkip(type) {
				switch (type) {
					case 'goods':
						uni.navigateTo({
							url: '/pages/GoodsDetails/GoodsDetails',
							animationType: 'zoom-fade-out',
							animationDuration: 200
						})
						break;
				}
			},
			/**
			 * 用户信息点击
			 * @param {Number} type
			 */
			onUserInfo() {
				if (this.isLogin) {
					uni.navigateTo({
						// url: "../../view/userEdit"
						url: "../../view/mine"
					})
				} else {
					uni.navigateTo({
						url: '../index/login'
					})
				}

			},
			//登陆
			hrefLogin() {
				uni.navigateTo({
					url: '../index/login'
				})
			}
		}
	}
</script>

<style scoped lang="scss">
  .tname_show{
    // display: flex
  }
	@import 'my.scss';

	.marginLeft {
		margin-left: 2px;
	}
	.myoperate{
		 width: 94%;
		 margin: 20rpx auto;
		 margin-left: 3%;
		 border-radius: 20rpx;
		 overflow: hidden;
	}
</style>
